<div class="header">
    <div class="top">
        <img src="https://fes.qyerstatic.com/fe_ssr_passport/41bd0a522fbeb024a41208a408ca73ec.png" alt="">
        <p>注册</p>
    </div>
    <div class="container">
        <label><div>手机号:</div> <input type="text" id="phone" required maxlength="11"></label>
        <div class="info">
            <p class="err">手机号格式错误</p>
            <p class="err">手机号已经注册!</p>
            <p class="ok">手机号码正确</p>
        </div>
        <label><div>用户名:</div> <input type="text" id="username" required></label>
        <div class="info">
            <p class="err">用户名格式错误</p>
            <p class="ok">用户名格式正确</p>
        </div>
        <label><div>密码:</div> <input type="password" id="password1" required></label>
        <div class="info">
            <p class="err">密码应为长度6-20的数字符号和字母组成</p>
            <p class="ok">密码格式正确</p>
        </div>
        <label><div>确认密码:</div> <input type="password" id="password2" required></label>
        <div class="info">
            <p class="err">两次密码不一致</p>
            <p class="ok">密码一致</p>
        </div>
        <div class="agree"><label>
            <input type="checkbox">我已阅读并同意</label>穷游用户使用协议</div>
        <button id="btn">注册</button>
    </div>
</div>